img{ border:none;}
html { font-size:100%; }
ul,ol,dl,dd,dt,li{list-style-type:none;}
header,footer,article,section,hgroup,nav,figure,aside{display:block}
img{width:100%;}
/* main_image */
.main_visual{
	overflow:hidden;
	position:relative;
	clear: both;
}
.main_image{overflow:hidden;position:relative;height:180px;}
.main_image ul{
	width:100%;
	overflow:hidden;
	position:absolute;
	top:0;
	left:0;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	
}
.main_image li{
	width:100%;
	height:auto;
	text-align: center;
	display: block;
}
.main_image li span{display:block;width:100%;height:220px;}
.main_image li a{display:block;width:100%;height:220px;}
.main_image li .img{
	text-align: center;
	width:100%;
	height:180px;
	
}

div.flicking_con{position:absolute;top:140px;left:50%;z-index:2;width:300px;height:21px;margin:0 0 0 -50px;}
div.flicking_con a{
	float:left;
	width:21px;
	height:21px;
	margin:0;
	padding:0;
	background:url('../images/btn_main_img.png') 0 0 no-repeat;
	display:block;
	text-indent: -1000px;
}
div.flicking_con a.on{background-position:0 -18px}
#btn_prev,#btn_next{z-index:300;position:absolute;display:block;width:73px!important;height:74px!important;top:50%;margin-top:-37px;display:none;}
#btn_prev{background:url(../images/hover_left.png) no-repeat left top;left:100px;}
#btn_next{background:url(../images/hover_right.png) no-repeat right top;right:100px;}

.banner{
	
margin-left: auto;
	width:100%;
	height:140px;
overflow: hidden;

}
.banner_blur{
	
background-repeat:no-repeat;
background-size:100% 100%;
-webkit-filter:blur(15px);
-moz-filter:blur(15px);
-o-filter:blur(15px);
-ms-filter:blur(15px);
filter:blur(15px);
	
}
.pic{
	
width: 120px;
height:120px;
margin: 0 auto;
background-size:100% 100%;
background-repeat:no-repeat;
border-radius: 50%;
border: 2px solid #ffffff;
position:absolute;
left:0;
top:60px;	
right:0px;	
}
.top_text{
margin: 0 auto;	
position:absolute;	
left:0;
top:188px;	
right:0px;	
text-align: center;
text-shadow: 1px 0px 10px #000000;	
}
.top_text  p{	
font-size:16px;
color:#ffffff;
}
.top_text  .p2{	
font-size:14px;
color:#ffffff;
}





		#frame {/*----------图片轮播相框容器----------*/
	position: absolute; /*--绝对定位，方便子元素的定位*/
	width: 100%;
	height: 260px;
	overflow: hidden;/*--相框作用，只显示一个图片---*/
	border-radius:0px;
	margin-top: -130px;
	clear: both;
		}
		#dis {/*--绝对定位方便li图片简介的自动分布定位---*/
			position: absolute;
			left: -50px;
			top: -10px;
			opacity: 0.5;
		}
		#dis li {
			display: inline-block;
			width: 200px;
			height: 20px;
			margin: 0 50px;
			float: left;
			text-align: center;
			color: #fff;
			border-radius: 10px;
			background: #000;
		}
		#photos img {
			float: left;
			width:640px;
		}
		#photos {/*---设置总的图片宽度--通过位移来达到轮播效果----*/
			position: absolute;z-index:9px;
			width: calc(640px * 4);/*---修改图片数量的话需要修改下面的动画参数*/
		}
		.play{
			animation: ma 20s ease-out infinite alternate;/**/
		}
		@keyframes ma {/*---每图片切换有两个阶段：位移切换和静置。中间的效果可以任意定制----*/
			0%,25% {		margin-left: 0px;		}
			30%,50% {		margin-left: -640px;	}
			55%,75% {		margin-left: -1280px;	}
			80%,100% {		margin-left: -1920px;	}
		}
		.num{
			position:absolute;z-index:10;
			display:inline-block;
			right:10px;top:220px;
			border-radius:100%;
			background:#f00;
			width:25px;height:25px;
			line-height:25px;
			cursor:pointer;
			color:#fff;
			text-align:center;
			opacity:0.8;
		}
		.num:hover{background:#00f;}
		.num:hover,#photos:hover{animation-play-state:paused;}
		.num:nth-child(2){margin-right:30px}
		.num:nth-child(3){margin-right:60px}
		.num:nth-child(4){margin-right:90px}
		#a1:hover ~ #photos{animation: ma1 .5s ease-out forwards;}
		#a2:hover ~ #photos{animation: ma2 .5s ease-out forwards;}
		#a3:hover ~ #photos{animation: ma3 .5s ease-out forwards;}
		#a4:hover ~ #photos{animation: ma4 .5s ease-out forwards;}
		@keyframes ma1 {0%{margin-left:-1200px;}100%{margin-left:-0px;}	}
		@keyframes ma2 {0%{margin-left:-1200px;}100%{margin-left:-640px;}	}
		@keyframes ma3 {100%{margin-left:-1280px;}	}
		@keyframes ma4 {100%{margin-left:-1920px;}	}
/*流程记录CSS样式*/
			.track-rcol{width: 95%; border: 0px solid #eee;margin-bottom:50px;}
			.track-list{padding-left: 0px; position: relative;font-size:12px;}
			.track-list li{position: relative; padding: 20px 0 15px 40px; line-height:1.5; border-left: 1px solid #d9d9d9; color: #999;}
			.track-list li.first{color: red; padding-top: 0px; border-left-color: #fff;border-left: 1px solid #d9d9d9; }
			.track-list li .node-icon{position: absolute; left: -6px; top: 20px; width: 11px; height: 11px; background: url(../images/order-icons.png)  -21px -72px no-repeat;}
			.track-list li.first .node-icon{background-position:0 -72px;top: 0px;}
			.track-list li .lcname{margin-right: 20px; font-size:16px;  position: relative; display: inline-block; vertical-align: middle;}
			.track-list li .time{margin-right: 20px; position: relative; top: 4px; display: inline-block; vertical-align: middle;}
			.track-list li .txt{max-width: 600px; position: relative; top: 4px; display: inline-block; vertical-align: middle;}
			.track-list li.first .time{margin-right: 20px; }
			.track-list li.first .txt{max-width: 600px; }